/**
 * 赛程信息内容页面
 * */
import React from 'react';
import {
    Button,
    Tag,
    Card,
    Col,
    Row,
    DatePicker,
    Cascader,
    Select,
    Pagination,
    Table,
    Form,
    Input,
    Checkbox,
    Tooltip,
    message, PageHeader,
    Avatar
} from 'antd';
import {createFromIconfontCN, SearchOutlined} from '@ant-design/icons';
import {Link, withRouter} from 'react-router-dom'
import axios from 'axios'
import qs from 'qs'
import moment from 'moment';
import './Game.less';
import {UserOutlined, QuestionCircleOutlined} from '@ant-design/icons';
import {CommonService, UserService} from '../eosjs/EosService'
moment.locale('zh-cn');
const {RangePicker} = DatePicker;
const {Option} = Select;
const {Column, ColumnGroup} = Table;
const IconFont = createFromIconfontCN({
    scriptUrl: '//at.alicdn.com/t/font_1692529_t4gbhg8wyo.js'
});
const layout = {
    labelCol: {span: 8},
    wrapperCol: {span: 8},
};
const tailLayout = {
    wrapperCol: {offset: 8, span: 16},
};

class Login extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            remember: true,
            avatarUrl: "https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png",
            privateKey: "",
            userName: ""
        };
    }



    componentWillMount() {
        this.getLoginInfoFromCookie();
    }

    onFinish = values => {
        console.log('Success:', values);
        /*为空，警告*/
        if (typeof (values.userName) == undefined || values.userName == "" || values.userName == "undefined") {
            message.warning("请输入用户名！");
            return;
        }
        if (typeof (values.privateKey) == undefined || values.privateKey == "" || values.privateKey == "undefined") {
            message.warning("请输入私钥！");
            return;
        }
        CommonService.login(values.userName, values.privateKey)
            .then(res => {
                console.log(res)
                //登录失败
                if(res.status === false){
                    message.error("登录失败，用户名或密码错误！");
                }
                //登录成功
                else if(res.status === true){
                    message.success("登录成功！");
                    localStorage.setItem('name_account', values.userName);
                    localStorage.setItem('private_key', values.privateKey);
                    this.props.history.push("/home");
                }
            })
        // console.log(localStorage.getItem("username"))
        /* 登录成功，则保存私钥至cookie，跳转至首页 */

        // this.forceUpdate();
    };

    render() {
        return (
            <div className="login">
                <PageHeader
                    className="site-page-header"
                    onBack={() => this.props.history.go(-1)}
                    title="登录"
                    // subTitle="This is a subtitle"
                />
                <Row justify="center">
                    <Col span={8}><Avatar size={128} src={this.state.avatarUrl}/></Col>
                </Row>
                <Row justify="center">
                    <Col span={8}>
                        <Form
                            name="basic"
                            initialValues={{
                                remember: true,
                                privateKey: this.state.privateKey,
                                userName: this.state.userName
                            }}
                            onFinish={this.onFinish}
                            // onFinishFailed={onFinishFailed}
                        >
                            <Form.Item
                                label={
                                    <span>用户名&nbsp;</span>
                                }
                                name="userName"
                            >
                                <Input placeholder="请输入用户名" onChange={this.userNameChange}/>
                            </Form.Item>
                            <Form.Item
                                label={
                                    <span>
                                私钥&nbsp;
                                        <Tooltip title="请输入EOS私钥">
                                    <QuestionCircleOutlined style={{fontSize: '1.0rem'}}/>
                                </Tooltip>
                        </span>
                                }
                                name="privateKey"
                            >
                                <Input.Password placeholder="请输入EOS私钥"/>
                            </Form.Item>

                            <Form.Item name="remember" valuePropName="checked">
                                <Checkbox>记住私钥</Checkbox>
                            </Form.Item>

                            <Form.Item>
                                <Button type="primary" htmlType="submit">
                                    登录
                                </Button>
                            </Form.Item>
                        </Form>
                    </Col>
                </Row>

            </div>


        )
    }

    getLoginInfoFromCookie = () => {
        // let arr1, reg1 = new RegExp("(^| )" + 'privateKey' + "=([^;]*)(;|$)");
        // let arr2, reg2 = new RegExp("(^| )" + 'userName' + "=([^;]*)(;|$)");
        //
        // let privateKey = '';
        // let userName = '';
        // if (arr1 = document.cookie.match(reg1)) {
        //     privateKey = unescape(arr1[2]);
        // }
        // if (arr2 = document.cookie.match(reg2)) {
        //     userName = unescape(arr2[2]);
        // }
        this.setState({
            userName: localStorage.getItem("name_account"),
            privateKey: localStorage.getItem("private_key")
        })
        // console.log(document.cookie, privateKey);
    }
    getUserInfo = (userName) => {
        UserService.getUserInfo(userName).then(res => {
            console.log(res)
            if (res.rows !== null) {
                this.setState({
                    avatarUrl: res.rows.avatar_url
                })
                console.log(this.state.avatarUrl)
            }
            else{
                this.setState({
                    avatarUrl: "https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png",
                })
            }
        })
    }
    userNameChange = (e) => {
        this.getUserInfo(e.target.value);
    }
}

// Game.propTypes = {
//     activeName: PropTypes.string,
//     gameInfo: PropTypes.object,
// };
export default Login;
